<!DOCTYPE html>
<html lang="zh-CN">

<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <style>
        div {
            height: 200px;
            margin-bottom: 10px;
        }
    </style>
</head>

<body>
    <input type="button" value="设置文本" id="btnOne">
    <input type="button" value="设置内容" id="btnTwo">
    <div></div>
    <div></div>
    <div></div>

    <!-- 需要给3个div设置边框和文本 -->
    <!--1. 需要引入jQuery文件-->
    <script src="./jquery-1.12.4.js"></script>
    <script>



        //入口函数
        $(document).ready(function () {
            //设置边框
            $('#btnOne').click(function () {
                $('div').css('border', '1px solid red');
            });
            //设置文本
            $('#btnTwo').click(function () {
                $('div').text('我是设置的文本');
            });
        });

        //这又是个入口函数
        $(document).ready(function () {
            $(document).ready(function () {
                console.log("我又是个入口函数");
            })
        })
    </script>
   <!-- //JQuery的优势 -->
   <!-- 1.是可以写多个入口函数的。
   2.jQuery的api名字都容易记忆
   3.jQuery代码简洁
   4.jQuery帮我们解决了浏览器问题
   5.容错率较高，前面的代码出现了问题，后面的代码不受影响 -->
</body>

</html>